<template>
  <div id="admin_valid">
    <CommonTable
      :query-api="'/manage/validPatient/page'"
      :query-params="param"
      :query-serve="'validator'"
      :custom-col="true"
      :columns="columns"
      @search-finish="searchFinish"
      @get-custom-col="getCustomCol"
      ref="validRef"
      name="admin_valid_base_info_table"
    >
      <template #tableSearchForm>
        <a-form id="internal_drawer_form_model" layout="inline">
          <a-form-item label="医院">
            <a-select
              v-model:value="formInfo.hospId"
              style="width: 240px"
              popupClassName="common_select_dropdown"
              allowClear
              show-search
              :filter-option="filterOption"
              @change="selectChange"
            >
              <a-select-option
                v-for="item in hospList"
                :key="item.id"
                :value="item.id"
                :desc="item.desc"
                :code="item.code"
                >{{ item.desc }}</a-select-option
              >
            </a-select>
          </a-form-item>
          <a-form-item class="filter_footer" :label-col="{ span: 0 }" :wrapper-col="{ span: 24 }">
            <a-space>
              <a-button type="primary" @click="onSerach" :loading="loading" :disabled="loading"
                >查询</a-button
              >
              <a-button @click="addVaild()" :icon="h(PlusOutlined)">新增</a-button>
            </a-space>
          </a-form-item>
        </a-form>
      </template>
      <template #otherAction="{ record }">
        <a-switch
          style="margin-left: 10px"
          size="small"
          checkedChildren="校验"
          unCheckedChildren="排除"
          @change="handleForbiddened(record)"
          :checked="!record.isForbiddened"
        />
      </template>
    </CommonTable>
    <AddModal ref="addRef" :warnLevelList="warnLevelList" @get-page="onSerach"></AddModal>
  </div>
</template>
<script lang="ts" setup>
import CommonTable from '@/components/common_table/index.vue'
import AddModal from './add_modal.vue'
import type { TColumn } from '@/components/common_table/type'
import { useValidHook } from '@/hooks/valid_hook'
import { filterOption } from '@/utils/filter_util'
import { ref, h, onMounted } from 'vue'
import { PlusOutlined } from '@ant-design/icons-vue'
import { find } from 'lodash-es'
const {
  getOptionList,
  param,
  formInfo,
  hospList,
  warnLevelList,
  handleForbiddened,
  getValidExcludeOption,
  selectChange,
  getCustomCol
} = useValidHook()
const columns = ref<TColumn[]>([
  {
    title: '性别',
    dataIndex: 'sex',
    key: 'sex',
    align: 'left',
    width: 180,
    ellipsis: true,
    showCol: true
  },
  {
    title: '最小年龄',
    dataIndex: 'minAge',
    key: 'minAge',
    align: 'left',
    width: 180,
    ellipsis: true,
    showCol: true,
    customRender: ({ record }: any) => {
      if (record.minAge) {
        return record.minAge + record.ageUnit
      } else {
        return ''
      }
    }
  },
  {
    title: '最大年龄',
    dataIndex: 'maxAge',
    key: 'maxAge',
    align: 'left',
    width: 180,
    ellipsis: true,
    showCol: true,
    customRender: ({ record }: any) => {
      if (record.maxAge) {
        return record.maxAge + record.ageUnit
      } else {
        return ''
      }
    }
  },
  {
    dataIndex: 'warnLevel',
    key: 'warnLevel',
    title: '警告级别',
    align: 'left',
    width: 180,
    ellipsis: true,
    customRender: ({ text }) => {
      if (text) {
        let info = find(warnLevelList.value, (f: any) => f.value === text)
        return info?.label || ''
      } else {
        return ''
      }
    },
    showCol: true
  },
  {
    title: '排除字符',
    dataIndex: 'excludeWord',
    key: 'excludeWord',
    align: 'center',
    width: 180,
    showCol: true
  },
  {
    title: '规则依据',
    dataIndex: 'remark',
    key: 'remark',
    align: 'center',
    width: 180,
    ellipsis: true,
    showCol: true
  },
  {
    title: '默认提示',
    dataIndex: 'warnMsg',
    key: 'warnMsg',
    align: 'center',
    width: 180,
    ellipsis: true,
    showCol: true
  },
  {
    title: '扣分数',
    key: 'score',
    dataIndex: 'score',
    width: 180,
    ellipsis: true,
    showCol: true
  },
  {
    title: '当前医院排除?',
    key: 'isForbiddened',
    dataIndex: 'isForbiddened',
    width: 180,
    ellipsis: true,
    showCol: true,
    customRender: ({ text }) => {
      if (text) {
        return h(
          'span',
          {
            style: {
              color: 'red'
            }
          },
          '是'
        )
      } else {
        return h(
          'span',
          {
            style: {
              color: 'green'
            }
          },
          '否'
        )
      }
    }
  },
  {
    title: '是否禁用',
    key: 'disabled',
    dataIndex: 'disabled',
    width: 180,
    ellipsis: true,
    showCol: true,
    customRender: ({ text }) => {
      if (text) {
        return h(
          'span',
          {
            style: {
              color: 'red'
            }
          },
          '是'
        )
      } else {
        return h(
          'span',
          {
            style: {
              color: 'green'
            }
          },
          '否'
        )
      }
    }
  },
  {
    fixed: 'right',
    title: '操作',
    width: 190,
    key: 'action',
    align: 'center',
    showCol: true
  }
])
const addRef = ref()
const loading = ref(false)
const validRef = ref()
async function onSerach() {
  await getValidExcludeOption()
  if (validRef.value) {
    validRef.value.getPage(param.value)
  }
}
function addVaild() {
  if (addRef.value) {
    addRef.value.showModal()
  }
}
function searchFinish() {
  loading.value = false
}
onMounted(async () => {
  await getOptionList()
  onSerach()
})
</script>
<style lang="scss" scoped>
#admin_valid {
  @include w-h-cover();
}
</style>
